import { createSlice } from '@reduxjs/toolkit';

export interface StreamListProps {
	type: string;
	audioOnly: boolean;
	id: string;
	label: string;
	clientId: string;
	streamMode: string;
	muteStatus: boolean;
	isScreenSyncMode: boolean;
}

const customerStreamSlice = createSlice({
	name: 'customerStream',
	initialState: [] as StreamListProps[],
	reducers: {
		setCustomerStreamList(state: StreamListProps[], action): StreamListProps[] {
			return [...state, ...action.payload];
		},
		setCustomerLeave(state, action) {
			let streams = state.filter(item => item.label !== action.payload);
			return streams;
		},
		clearCustomerStreamList() {
			return [];
		}
	}
});

const agentStreamSlice = createSlice({
	name: 'agentStream',
	initialState: [] as StreamListProps[],
	reducers: {
		setAgentStreamList(state: StreamListProps[], action): StreamListProps[] {
			return [...state, ...action.payload];
		},
		setAgentLeave(state, action) {
			let streams = state.filter(item => item.label !== action.payload);
			return streams;
		},
		setMuteAgentStream(state, action) {
			state.forEach(item => {
				if (item.clientId === action.payload.clientId) {
					item.muteStatus = action.payload.muteStatus;
				}
			});
			return state;
		},
		setUpdateAgentStream(state, action) {
			state.forEach(item => {
				if (item.clientId === action.payload.clientId) {
					item.streamMode = action.payload.streamMode;
				}
			});
			return state;
		},
		clearAgentStreamList() {
			return [];
		}
	}
});

const otherStreamSlice = createSlice({
	name: 'agentStream',
	initialState: [] as StreamListProps[],
	reducers: {
		setOtherStreamList(state: StreamListProps[], action): StreamListProps[] {
			return [...state, ...action.payload];
		},
		setMuteOtherStream(state, action) {
			state.forEach(item => {
				if (item.clientId === action.payload.clientId) {
					item.muteStatus = action.payload.muteStatus;
				}
			});
			return state;
		},
		setOtherLeave(state, action) {
			let streams = state.filter(item => item.label !== action.payload);
			return streams;
		},
		clearOtherStreamList() {
			return [];
		}
	}
});

const screenStreamSlice = createSlice({
	name: 'screenStream',
	initialState: {
		mode: '',
		receiveClicentId: '',
		screenPublicationId: ''
	},
	reducers: {
		setScreenStream(state, action) {
			return { ...state, ...action.payload };
		}
	}
});

const renderedStreamSlice = createSlice({
	name: 'renderedStream',
	initialState: [] as any,
	reducers: {
		setRenderedStream(state: any, action: any) {
			return [...state, action.payload];
		},

		replaceStream(state: any, action: any) {
			state.forEach((item: any) => {
				if (item.id === action.payload.id) {
					item = action.payload;
					console.log('replaceStream:', item, action.payload);
				}
			});
			return state;
		},

		clearRenderStream() {
			return [];
		}
	}
});

const customerStreams = customerStreamSlice.reducer;
const agentStreams = agentStreamSlice.reducer;
const otherStreams = otherStreamSlice.reducer;
const screenStreams = screenStreamSlice.reducer;
const renderedStreams = renderedStreamSlice.reducer;

export const { setCustomerStreamList, setCustomerLeave, clearCustomerStreamList } = customerStreamSlice.actions;
export const { setAgentStreamList, setAgentLeave, setUpdateAgentStream, setMuteAgentStream, clearAgentStreamList } = agentStreamSlice.actions;
export const { setOtherStreamList, setOtherLeave, clearOtherStreamList } = otherStreamSlice.actions;
export const { setScreenStream } = screenStreamSlice.actions;
export const { setRenderedStream, clearRenderStream, replaceStream } = renderedStreamSlice.actions;
export { agentStreams, customerStreams, otherStreams, screenStreams, renderedStreams };
